<template>
  <div class="search-container">
    <div class="put-bg">
      <input type="text" placeholder="女神的礼物">
      <!--<img src="../assets/images/下载3.png" alt="">-->
      <i class="fa fa-search" aria-hidden="true"></i>
    </div>
    <ul>
      <li>酸奶</li>
      <li>面包</li>
      <li>牛奶</li>
      <li>鸡蛋</li>
      <li>儿童湿巾</li>
      <li>卫生巾</li>
      <li>榨菜</li>
      <li>鲜花</li>
    </ul>
  </div>
</template>

<script>
  export default {
    name: ""
  }
</script>

<style lang="scss" scoped>
.search-container{
  padding: 18px 26px 0;
  .put-bg{
    position: relative;
    border-radius: 48px;
    input{
      height: 104px;
      width: 100%;
      border-radius: 48px;
      font-size: 46px;
      text-align: center;
      color: #999;
      font-weight: bold;
      border: 0;
      /*background-color: #fff;*/
      position: relative;
      /*z-index: 2;*/
      /*background: url("../assets/images/下载3.png") no-repeat 400px center;*/
    }
    i{
      position: absolute;
      left: 420px;
      top: 50%;
      font-size: 46px;
      color: #999;
      transform: translateY(-50%);
    }
  }
  ul{
    justify-content: space-around;
    padding: 25px 0;
    margin: 0;
    display: flex;
    li{
      list-style: none;
      font-size: 40px;
      font-weight: bold;
      color: whitesmoke;
    }
  }
}
</style>
